<template  >
  <v-form v-model="valid" ref="mypurchaseForm">
    <v-container grid-list-md>
      <v-layout wrap>
        <v-flex xs12 sm6>
          <v-text-field v-model="purchase.lsh" label="流水号：" disabled></v-text-field>
        </v-flex>
        <v-flex xs12 sm6>
          <v-select
            :disabled="isEdit"
            v-model="purchase.lx"
            item-text="text"
            item-value="value"
            :items="items"
            label="类型"
            required
          ></v-select>
        </v-flex>
        <v-flex v-if="isEdit" xs12 sm6>
          <v-text-field v-model="purchase.truename" label="录入人：" hint disabled></v-text-field>
        </v-flex>
        <v-flex v-if="isEdit" xs12 sm6>
          <v-text-field
            v-model="purchase.lrsj"
            label="录入时间"
            :disabled="isEdit"
            hint
            persistent-hint
          ></v-text-field>
        </v-flex>
        <v-flex>
          <v-layout wrap>
            <v-select
              :disabled="isEdit"
              v-model="purchase.outStoreCode"
              item-text="storeName"
              item-value="storeCode"
              :items="stores"
              @change="change"
              label="调出仓库"
              required
            />
            <v-select
              :disabled="isEdit"
              v-model="purchase.inStoreCode"
              item-text="storeName"
              item-value="storeCode"
              :items="stores"
              @change="change"
              label="调入仓库"
              required
            />
          </v-layout>
        </v-flex>
        <!-- <v-flex xs12>
          <v-text-field label="联系人/联系方式"></v-text-field>
        </v-flex>-->

        <!-- <v-flex xs12 sm6>
          <v-autocomplete :items="['张三', '李四']" label="采购员" multiple></v-autocomplete>
          <v-flex xs12></v-flex>
        </v-flex>-->
        <v-flex>
          <formtable ref="datatable" v-model="purchase.list" :datasource="purchase.list"></formtable>
        </v-flex>
      </v-layout>
    </v-container>

    <v-layout class="my-4" row>
      <v-spacer />
      <v-btn v-if="!purchase.lsh" @click="submit" color="primary">保存</v-btn>
      <v-btn v-if="!purchase.lsh" @click="clear">重置</v-btn>
      <v-btn v-if="purchase.lsh && purchase.status === 0" @click="commit">提交</v-btn>
      <v-btn v-if="purchase.lsh &&  purchase.status === 0" @click="del">作废</v-btn>
    </v-layout>
  </v-form>
</template>
<script>
import formtable from "./TransferTable";

export default {
  name: "transfer-form",
  props: {
    oldpurchase: {
      type: Object
    },
    isEdit: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      valid: false, // 表单校验结果标记
      purchase: {
        lsh: "", //
        id: "", //
        lrid: "", //
        status: 0, //
        lx: "",
        stores: [],
        list: [],
        outStoreCode: "",
        inStoreCode: "",
        inStoreName: "",
        outStoreName: ""
      },
      stores: [],
      nameRules: [
        v => !!v || "路线名称不能为空",
        v => v.length > 1 || "路线名称至少2位"
      ],
      checkbox: false,
      items: [
        { text: "正品", value: 0 },
        { text: "样机", value: 1 },
        { text: "赠品", value: 2 },
        { text: "残次", value: 3 }
      ]
    };
  },
  methods: {
    getDataFromServer() {
      this.$http.get("/item/user/store").then(res => {
        this.stores = res.data;
      });
    },
    change() {},
    submit() {
      // 表单校验
      if (this.$refs.mypurchaseForm.validate()) {
        // 定义一个请求参数对象，通过解构表达式来获取purchase中的属性
        const { ...params } = this.purchase;
        params.username = window.localStorage.getItem("username");
        params.lrid = window.localStorage.getItem("id");
        params.truename = window.localStorage.getItem("truename");
        params.list = this.$refs.datatable.datasource;
        params.deptCode = window.localStorage.getItem("deptCode");

        if (!params.list) {
          this.$message.error("明细缺失！");
          return;
        }
        if ([0, 1, 2, 3].indexOf(this.purchase.lx) < 0) {
          this.$message.error("请选择类型");
          return;
        }
        if (!this.purchase.inStoreCode ||!this.purchase.outStoreCode ) {
          this.$message.error("请选择店铺");
          return;
        }
        if (params.outStoreCode === params.inStoreCode) {
          this.$message.error("不能调入同一仓库！");
          return;
        }
        this.$http({
          method: "post",
          url: this.isEdit ? "/item/ckdb/modify" : "/item/ckdb/insert",
          data: JSON.stringify(params),
          headers: {
            "Content-Type": "application/json;charset=UTF-8"
          }
        })
          .then(() => {
            // 关闭窗口
            this.$emit("close");
            this.$message.success("保存成功！");
            this.purchase = {};
          })
          .catch(() => {
            this.$message.error("保存失败！");
          });
      }
    },
    commit() {
      // 表单校验
      if (this.$refs.mypurchaseForm.validate()) {
        // 定义一个请求参数对象，通过解构表达式来获取purchase中的属性
        const { ...params } = this.purchase;
        params.username = window.localStorage.getItem("username");
        params.lrid = window.localStorage.getItem("id");
        // params.lx = window.localStorage.getItem("lx");
        params.truename = window.localStorage.getItem("truename");
        // params.list = this.$refs.datatable.datasource;

        this.$http({
          method: "post",
          url: "/item/ckdb/commit",
          data: JSON.stringify(params),
          headers: {
            "Content-Type": "application/json;charset=UTF-8"
          }
        })
          .then(() => {
            // 关闭窗口
            this.$emit("close");
            this.$message.success("提交成功！");
          })
          .catch(() => {
            this.$message.error("提交失败！");
          });
      }
    },
    del() {
      // 表单校验
      if (this.$refs.mypurchaseForm.validate()) {
        // 定义一个请求参数对象，通过解构表达式来获取purchase中的属性
        const { ...params } = this.purchase;
        params.username = window.localStorage.getItem("username");
        params.lrid = window.localStorage.getItem("id");
        // params.lx = window.localStorage.getItem("lx");
        params.truename = window.localStorage.getItem("truename");
        params.list = [];

        this.$http({
          method: "post",
          url: "/item/ckdb/delete",
          data: JSON.stringify(params),
          headers: {
            "Content-Type": "application/json;charset=UTF-8"
          }
        })
          .then(() => {
            // 关闭窗口
            this.$emit("close");
            this.$message.success("作废成功！");
          })
          .catch(() => {
            this.$message.error("作废失败！");
          });
      }
    },
    clear() {
      // 重置表单
      this.$refs.mypurchaseForm.reset();
    }
  },
  watch: {
    oldpurchase: {
      // 监控oldpurchase的变化
      handler(val) {
        console.info("oldpurchase");

        this.getDataFromServer();
        if (val) {
          // 注意不要直接复制，否则这边的修改会影响到父组件的数据，copy属性即可
          this.purchase = Object.deepCopy(val);
          // this.purchase.list = [];
        } else {
          // 为空，初始化brand
          this.purchase = {
            name: "",
            code: "",
            id: "",
            status: 0,
            list: [],
            stores: [],
            outStoreCode: "",
            inStoreCode: "",
            inStoreName: "",
            outStoreName: ""
          };
        }
        console.info(this.purchase);
      },
      deep: true
    }
  },
  components: {
    formtable
  }
};
</script>

<style scoped>
</style>
